import React, { Component } from 'react'
/* 引入antd组件 */
import { List, InputItem, WhiteSpace, Button } from 'antd-mobile';
import 'antd-mobile/dist/antd-mobile.css';
/* 引入路由模块 */
// import { HashRouter as Router, Route, div, Link, Switch } from "react-router-dom"
/* 引入axios */
import axios from "axios"
/* 引入样式 */
import Logcss from "../scss/Login.module.scss"
export default class Login extends Component {
    state = {
        // num: 1
        phone: null,
        pass: null
    }
    // handle = () => {
    //     /* 第一个改变num方法 */
    //     this.setState({
    //         num: this.state.num + 1
    //     }, function () {
    //         console.log(this.state.num);
    //     })
    // }

    // handleClick = () => {
    //     this.inputRef.focus();
    // }
/* 注册账号 */
    handleRegistered = () => {
        // console.log("zhuce");
        this.props.history.push("/regist")
    }
    /* 登入判断，调用axios */
    handleLogin = () => {
        if (this.state.phone) {
            var str = this.state.phone.split(' ').join('')
            console.log(str);
            axios.post("http://s.linweiqin.com/api/s/loginCheck", {
                username: str,
                password: this.state.pass
            }).then(res => {
                console.log(res);
                if (res.data.status === 0) {
                /* 将token设置在localStorage中 */
                    localStorage.setItem("MyToken",res.data.wdata.oauth_token)
                    /* 跳转至主页 */
                    this.props.history.push("/")
                }
            })
        }

    }
    handlePchange(val) {
        // console.log(e);
        this.setState({
            phone: val
        })
    }
    handleNchange = (val) => {
        this.setState({
            pass: val
        })
    }
    componentDidMount() {

    }
    render() {
        // const { getFieldProps } = this.props.form;
        return (
            <div className={Logcss.log}>
                {/* <h1>请登入</h1> */}
                <List renderHeader={() => '请输入您的账号密码'} className={Logcss.logForm}>

                    <InputItem
                        // {...getFieldProps('phone')}
                        className={Logcss.logPhone}
                        type="phone"
                        placeholder="186 1234 1234"
                        value={this.state.phone}
                        onChange={this.handlePchange.bind(this)}
                    >手机号</InputItem>
                    <InputItem
                        className={Logcss.logPass}
                        // {...getFieldProps('password')}
                        type="password"
                        placeholder="****"
                        value={this.state.pass}
                        onChange={this.handleNchange}
                    >密码</InputItem>
                    <Button type="primary" onClick={this.handleLogin} className={Logcss.logBtn}>登录</Button><WhiteSpace />
                    <Button onClick={this.handleRegistered} className={Logcss.logReg}>注册</Button>
                </List>

            </div>
        )
    }
}
